#app{
    height: 100%;
}
.coupon{
  min-height: 100%;
  padding-bottom: .1rem;
  box-sizing:border-box;
  -moz-box-sizing:border-box; /* Firefox */
  -webkit-box-sizing:border-box; /* Safari */
}
.list{
    width: 6.7rem;
    height: 2.43rem;
    display: flex;
    display: -webkit-flex;
    margin: 0 auto .4rem auto;
}
.usable-coupon{
    background:url('../../../assets/img/usable-coupon-bg.png') no-repeat center;
    background-size: 100%;
}
.unusable-coupon{
    background:url('../../../assets/img/unusable-coupon-bg.png') no-repeat center;
    background-size: 100%;
    color: #B0B0B0;      
}
.unusable-coupon span,.unusable-coupon p,.unusable-coupon h3,.unusable-coupon .text{
    color: #B0B0B0;
}
.coupon .item1{
    width: 2.5rem;
    margin-top: 1.4rem;
}
.coupon .item2{
    width: 4.3rem;
    margin-top: .38rem;
    margin-left: .34rem;
}
.item1 .icon{
    font-size: .4rem;
    margin-left: .5rem;
}
.item1 .money{
    font-size: .5rem;
    font-family: 'Gobold-Regular';
}
.item2 .time{
    font-size: .22rem;
    margin-top: .23rem;
}
.item2 .text{
    font-size: .26rem;
    color: #000000;
    font-weight: bold;
}
.item2 h3{
    font-size: .28rem;
    margin:0;
    margin-top: .36rem;
    margin-bottom: .12rem;
    margin-left: -.12rem;
}
.unusable-tag{
  background-color: #000000;
  color: #FEFEFE;
  width: 1.34rem;
  height: .39rem;
  line-height: .39rem;
  font-size: .22rem;
  top: .36rem;
  right: 0;
}
.coupon-box{
  padding-top: .4rem;
}